<template>
  <div class="app-container">
    <el-button
      @click="handleNew"
      v-if="local.position!=='1'"
      icon="el-icon-user-solid"
      type="primary"
    >添加学员</el-button>
    <el-button
      :loading="downloadLoading"
      style="margin:10px 10px 20px 20px;"
      @click="exportExcel(tableData)"
      icon="el-icon-download"
      type="primary"
    >下载表格</el-button>
    <el-button @click="clearFilter" type="primary">清除筛选</el-button>
    <el-button @click="selectAll" v-if="local.position=='2'" type="primary">查看全部</el-button>
    <el-button @click="delArray" v-if="local.position=='2'" type="primary">删除学员</el-button>
    <el-table
      ref="filterTable"
      border
      style="width: 100%"
      id="out-table"
      @filter-change="filterTagTable"
      @selection-change="hangdleSelectionChange"
      :data="tables.slice((currentPage-1)*pageSize,currentPage*pageSize)"
    >
      <el-table-column type="selection" align="center" v-if="local.position==2"></el-table-column>
      <el-table-column align="center" prop="time" label="日期"></el-table-column>
      <el-table-column align="center" prop="name" label="姓名"></el-table-column>
      <el-table-column align="center" prop="class" label="班级"></el-table-column>
      <el-table-column align="center" prop="phone" label="手机号" min-width="88px"></el-table-column>
      <el-table-column align="center" prop="product" label="产品线"></el-table-column>
      <el-table-column align="center" prop="teacher" label="班主任"></el-table-column>
      <el-table-column align="center" prop="manager" label="项目经理"></el-table-column>
      <el-table-column align="center" prop="admission" label="招生老师"></el-table-column>
      <el-table-column
        align="center"
        prop="status"
        label="状态"
        :filters="[{text: '正式', value: 0}, {text: '转中心', value: 1}, {text: '休学', value: 2}, {text: '脱产', value: 3}, {text: '结课', value: 4}, {text: '退费', value: 5}]"
        :column-key=" 'status' "
      >
        <template slot-scope="scope">{{ scope.row.status | statusFilter }}</template>
      </el-table-column>
      <el-table-column align="center" min-width="130px">
        <template slot="header" slot-scope="scope">
          <el-input v-model="search" size="mini" placeholder="请输入搜索条件" />
        </template>
        <template slot-scope="scope">
          <el-button
            v-if="local.position!=2"
            title="回访"
            type="success"
            icon="el-icon-chat-dot-round"
            size="mini"
            circle
            @click="handleFollow(scope.row)"
          ></el-button>
          <el-button
            title="详情"
            @click="handleMessage(scope.row)"
            size="mini"
            type="info"
            circle
            icon="el-icon-tickets"
          ></el-button>
          <el-button
            title="修改"
            type="primary"
            icon="el-icon-edit"
            size="mini"
            circle
            @click="handleEdit(scope.row)"
          ></el-button>
          <el-button
            title="删除"
            type="danger"
            icon="el-icon-delete"
            size="mini"
            circle
            @click="del(scope.row)"
            v-if="local.position==2"
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页器 -->
    <div class="block" style="margin-top:15px">
      <el-pagination
        align="center"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 20]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
    <!-- 侧消息 -->
    <el-drawer
      title="学员更多信息"
      :visible.sync="messageBox"
      direction="rtl"
      size="50%"
      :xs="24"
      :sm="24"
    >
      <el-collapse v-model="activeName" accordion style="padding:0 15px">
        <el-collapse-item title="学员回访记录" name="1">
          <!-- 第一个 -->
          <el-table :data="messageBoxData" border max-height="500" style="width: 100%">
            <el-table-column prop="date" label="日期" width="100"></el-table-column>
            <el-table-column prop="visitor" label="回访者" width="100"></el-table-column>
            <el-table-column prop="content" label="回访内容"></el-table-column>
            <el-table-column width="60" align="center">
              <template slot-scope="scope">
                <el-button
                  v-if="local.username==scope.row.visitor || local.position==2"
                  type="danger"
                  icon="el-icon-delete"
                  size="mini"
                  circle
                  @click="deleteFollow(scope.row)"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
        <el-collapse-item title="首访表情况" name="2">
          <!-- 第二个 -->
          <el-form ref="tallForm" :model="tallForm" label-width="80px">
            <el-form-item label="学历">
              <el-select v-model="tallForm.education" placeholder="请选择学历">
                <el-option label="大专" value="0"></el-option>
                <el-option label="本科" value="1"></el-option>
                <el-option label="高中/中专" value="2"></el-option>
                <el-option label="研究生" value="3"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="学习目的">
              <el-select v-model="tallForm.objective" placeholder="请选择学习目的">
                <el-option label="充电提升" value="0"></el-option>
                <el-option label="转行" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="专业">
              <el-input v-model="tallForm.specialty"></el-input>
            </el-form-item>
            <el-form-item label="工作性质">
              <el-input v-model="tallForm.JobNature"></el-input>
            </el-form-item>
            <el-form-item label="其他">
              <el-input type="textarea" v-model="tallForm.other"></el-input>
            </el-form-item>
            <el-form-item v-if="local.position!=2">
              <el-button type="primary" @click="onSubmit">立即创建</el-button>
              <el-button @click="clearTall">取消</el-button>
            </el-form-item>
          </el-form>
        </el-collapse-item>
        <el-collapse-item title="增值服务" name="3">
          <!-- 第三个 -->
          <el-form ref="form" :model="fromdata" label-width="80px">
            <el-form-item label="增值服务:">
              <el-checkbox label="意向脱产" v-model="fromdata.outProduction" name="type"></el-checkbox>
              <el-checkbox label="意向口碑" v-model="fromdata.publicPraise" name="type"></el-checkbox>
              <el-checkbox label="意向证书" v-model="fromdata.certificate" name="type"></el-checkbox>
              <el-checkbox label="意向学历" v-model="fromdata.intEducation" name="type"></el-checkbox>
              <el-checkbox label="意向复购" v-model="fromdata.repPurchase" name="type"></el-checkbox>
              <el-input type="textarea" placeholder="备注情况" v-model="textarea"></el-input>
            </el-form-item>
            <el-form-item v-if="local.position!=2">
              <el-button type="primary" @click="submit">立即保存</el-button>
              <el-button>取消</el-button>
            </el-form-item>
          </el-form>
        </el-collapse-item>
      </el-collapse>
    </el-drawer>
    <!-- 添加、修改学员 -->
    <el-dialog
      :visible.sync="dialogFormVisible"
      :close-on-click-modal="false"
      :title="dialogType=='edit'?'修改信息':dialogType=='new'?'添加学员':'添加回访'"
      :before-close="closeDialog"
    >
      <el-form
        :model="form"
        :label-width="formLabelWidth"
        :rules="rules"
        ref="form"
        v-if="dialogType!=='followup'"
      >
        <el-form-item label="日期" prop="time">
          <el-date-picker
            style="width:100%"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"
            v-model="form.time"
            type="date"
            placeholder="选择日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="姓名" prop="name">
          <el-input v-model="form.name" autocomplete="off" placeholder="请输入学员姓名"></el-input>
        </el-form-item>
        <el-form-item label="班级" prop="class">
          <el-input v-model="form.class" autocomplete="off" placeholder="请输入学员班级"></el-input>
        </el-form-item>
        <el-form-item label="手机号" prop="phone">
          <el-input v-model="form.phone" autocomplete="off" placeholder="请输入学员手机号" maxlength="11"></el-input>
        </el-form-item>
        <el-form-item label="产品线" prop="product">
          <el-input v-model="form.product" placeholder="请输入学员所在产品线"></el-input>
        </el-form-item>
        <el-form-item label="班主任" prop="teacher">
          <el-select v-model="form.teacher" filterable placeholder="请选择班主任" style="width: 100%;">
            <el-option
              v-for="item in teacherData"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="项目经理" prop="manager">
          <el-select v-model="form.manager" filterable placeholder="请选择项目经理" style="width: 100%;">
            <el-option
              v-for="item in managerData"
              :key="item.label"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="招生老师" prop="admission">
          <el-input v-model="form.admission" autocomplete="off" placeholder="请输入招生老师"></el-input>
        </el-form-item>
        <el-form-item label="状态" prop="status">
          <el-select v-model="form.status" filterable placeholder="请选择状态" style="width:100%">
            <el-option
              v-for="item in status"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="地区" prop="address">
          <el-select v-model="form.address" filterable placeholder="请选择学员所在地区" style="width: 100%;">
            <el-option
              v-for="item in addressData"
              :key="item.label"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form v-else-if="dialogType==='followup'" ref="followForm" :model="form">
        <el-form-item :label="form.name+' 回访信息'">
          <el-input type="textarea" v-model="form.desc"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeDialog">取 消</el-button>
        <el-button
          type="primary"
          @click="dialogType=='new'?addStudent('form'):dialogType=='edit'?editStudent('form'):followStudent('followForm')"
        >确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { Notification, MessageBox } from "element-ui";
import { log } from "util";
import { clearInterval, setInterval } from "timers";

export default {
  name: "Table",
  data() {
    var checkPhone = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("手机号不能为空"));
      } else {
        const reg = /^1[3|5|7|8|9][0-9]\d{8}$/;
        if (reg.test(value)) {
          callback();
        } else {
          return callback(new Error("请输入正确的手机号"));
        }
      }
    };
    return {
      search: "",
      downloadLoading: false,
      // 班主任选择、项目经理选择
      teacherData: [],
      managerData: [],
      addressData: [],
      // 添加、修改
      dialogType: "new",
      dialogFormVisible: false,
      form: {
        time: "",
        name: "",
        class: "",
        phone: "",
        product: "",
        teacher: "",
        manager: "",
        admission: "",
        status: "",
        address: "",
        desc: ""
      },
      rules: {
        time: [
          {
            type: "string",
            required: true,
            message: "请选择日期",
            trigger: "change"
          }
        ],
        name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        class: [{ required: true, message: "请输入班级", trigger: "blur" }],
        phone: [{ required: true, validator: checkPhone, trigger: "blur" }],
        product: [{ required: true, message: "请输入产品线", trigger: "blur" }],
        teacher: [
          { required: true, message: "请选择班主任", trigger: "change" }
        ],
        manager: [
          { required: true, message: "请选择项目经理", trigger: "change" }
        ],
        admission: [
          { required: true, message: "请输入招生老师", trigger: "blur" }
        ],
        status: [{ required: true, message: "请选择状态", trigger: "change" }],
        address: [{ required: true, message: "请输入地区", trigger: "blur" }]
      },
      formLabelWidth: "100px",

      // 首访表字段信息
      tallForm: {
        education: "",
        objective: "",
        specialty: "",
        JobNature: "",
        other: ""
      },
      // 状态下拉框
      status: [
        {
          value: "0",
          label: "正式"
        },
        {
          value: "1",
          label: "转中心"
        },
        {
          value: "2",
          label: "休学"
        },
        {
          value: "3",
          label: "脱产"
        },
        {
          value: "4",
          label: "结课"
        },
        {
          value: "5",
          label: "退费"
        }
      ],
      // 分页
      currentPage: 1, // 默认第一页
      pageSize: 10, // 每页大小默认值
      // 表格数据
      tableData: [],
      oldData: [],
      // 筛选
      classList: [],
      productList: [],
      teacherList: [],
      managerList: [],
      // 学员更多信息
      messageBox: false,
      activeName: "1",
      fromdata: {
        outProduction: false,
        publicPraise: false,
        certificate: false,
        intEducation: false,
        repPurchase: false
      },
      textarea: "",
      messageBoxData: [],
      // 存储选中学员id
      tableDataAmount: [],
      ids: [],
      names: [],
      // 判断 权限
      local: localStorage
    };
  },
  created() {
    this.load();
    this.axios.get("/user/userAll").then(res => {
      var addressList = [];
      for (var i = 0; i < res.data.data.length; i++) {
        var address = res.data.data[i].address;
        if (toCom(address)) {
          addressList.push({ text: address, value: address });
        }
        function toCom(address) {
          for (var i = 0; i < addressList.length; i++) {
            if (addressList[i].text === address) {
              return false;
            }
          }
          return true;
        }
        this.addressData = addressList;

        var position = res.data.data[i].position;
        if (position == 0) {
          this.teacherData.push({
            value: res.data.data[i].username,
            lable: res.data.data[i].username
          });
        } else if (position == 1) {
          this.managerData.push({
            value: res.data.data[i].username,
            lable: res.data.data[i].username
          });
        }
      }
    });
  },
  watch: {
    $route: {
      handler: function(val, oldVal) {
        this.load();
      },
      // 深度观察监听
      deep: true
    },
    // 检测表格数据过滤变化，自动跳到第一页
    tables() {
      this.currentPage = 1;
    }
  },
  computed: {
    // 搜索过滤
    tables() {
      const search = this.search;
      if (search) {
        return this.tableData.filter(dataNews => {
          return Object.keys(dataNews).some(key => {
            return String(dataNews[key])
              .toLowerCase()
              .includes(search.toLowerCase());
          });
        });
      }
      return this.tableData;
    },
    // 总条数
    total() {
      return this.tables.length;
    }
  },
  methods: {
    load() {
      this.tableData = [];
      var table = JSON.parse(localStorage.table);
      var po = table.position;
      var us = table.username;

      var position = localStorage.position;
      var username = localStorage.username;

      this.axios
        .get("/student", { params: { position: position, username: username } })
        .then(res => {
          for (var i = 0; i < res.data.data.length; i++) {
            if (po == 0) {
              if (res.data.data[i].teacher == us) {
                this.tableData.push(res.data.data[i]);
                this.oldData.push(res.data.data[i]);
              }
            } else if (po == 1) {
              if (res.data.data[i].manager == us) {
                this.tableData.push(res.data.data[i]);
                this.oldData.push(res.data.data[i]);
              }
            }
          }

          // 筛选
          for (var i = 0; i < this.tableData.length; i++) {
            var cs = this.tableData[i].class;
            this.sift(cs, this.classList);
            var product = this.tableData[i].product;
            this.sift(product, this.productList);
            var teacher = this.tableData[i].teacher;
            this.sift(teacher, this.teacherList);
            var manager = this.tableData[i].manager;
            this.sift(manager, this.managerList);
          }
        });
    },
    // 打开添加学员弹框
    handleNew() {
      this.dialogType = "new";
      this.dialogFormVisible = true;
    },
    // 添加学员
    addStudent(formName) {
      var time = this.form.time;
      var name = this.form.name;
      var cs = this.form.class;
      cs = cs.toUpperCase();
      var phone = this.form.phone;
      var product = this.form.product;
      product = product.toUpperCase();
      var teacher = this.form.teacher;
      var manager = this.form.manager;
      var admission = this.form.admission;
      var status = this.form.status;
      var address = this.form.address;
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.axios
            .post(
              "/student/addstudent",
              `time=${time}&name=${name}&class=${cs}&phone=${phone}&product=${product}&teacher=${teacher}&manager=${manager}&admission=${admission}&status=${status}&address=${address}`
            )
            .then(res => {
              if (res.data.ok == 1) {
                this.$notify({
                  title: "添加成功",
                  message: `${name} 添加成功`,
                  type: "success"
                });
                this.closeDialog();
                this.load();
              } else {
                this.$notify({
                  title: "添加失败",
                  message: res.data.msg,
                  type: "error"
                });
                this.form.name = "";
              }
            });
        } else {
          alert("学员已存在，请重新输入");
          this.form.name = "";
          return false;
        }
      });
    },
    // 筛选函数
    sift(list, arr) {
      for (var i = 0; i < this.tableData.length; i++) {
        if (toCom(list)) {
          arr.push({ text: list, value: list });
        } else {
        }
        function toCom(list) {
          for (var i = 0; i < arr.length; i++) {
            if (arr[i].text === list) {
              return false;
            }
          }
          return true;
        }
      }
    },
    // 筛选
    filterTagTable(filters) {
      var newData = this.tableData;
      this.getAll(filters, newData); // 筛选所选项下的所有数据，需要调用后端接口
    },
    getAll(filters, newData) {
      this.tableData = [];
      for (var i = 0; i < newData.length; i++) {
        if (newData[i].status == filters.status[0]) {
          this.tableData.push(newData[i]);
        }
      }
      if (filters.status[0] == undefined) {
        this.tableData = this.oldData;
      }
    },

    // 清除所有过滤器
    clearFilter() {
      this.$refs.filterTable.clearFilter();
    },
    // 获取选中学员数据
    hangdleSelectionChange(data) {
      this.tableDataAmount = data;
    },
    // 删除选中学员
    delArray() {
      var _this = this;
      // 拿到选中的数据
      var val = this.tableDataAmount;

      // 如果选中数据存在
      if (val) {
        val.forEach(function(item, index) {
          _this.ids.push(item.id);
          _this.names.push(item.name);
          _this.tableData.forEach(() => {
            _this
              .$confirm(`是否删除选中学员?`, "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
              })
              .then(() => {
                _this.axios
                  .post(
                    "/student/delete",
                    `id=${_this.ids}&name=${_this.names}`
                  )
                  .then(res => {
                    if (res.data.ok == 1) {
                      _this.$message({
                        type: "success",
                        message: res.data.msg
                      });
                      _this.load();
                    } else {
                      _this.$message.error(res.data.msg);
                    }
                  });
              })
              .catch(() => {
                _this.$message({
                  type: "info",
                  message: "已取消删除"
                });
              });
          });
        });
      }

      this.$refs.filterTable.clearSelection();
    },
    // 查看全部学员
    selectAll() {
      this.$router.push("/main/table");
      delete localStorage.table;
      localStorage.setItem("table", JSON.stringify({ position: "2" }));
      this.axios.get("/student").then(res => {
        this.tableData = res.data.data;
      });
    },
    // 打开添加回访弹框
    handleFollow(item) {
      this.dialogType = "followup";
      this.dialogFormVisible = true;
      this.form.class = item.class;
      this.form.name = item.name;
      this.form.manager = item.manager;
    },
    // 添加回访学员信息
    followStudent(formName) {
      var name = this.form.name;
      var visitor = localStorage.username;
      var desc = this.form.desc;
      var cs = this.form.class;
      this.$refs[formName].validate(valid => {
        if(!desc){ 
          this.$notify({
            title: "回访内容不能为空！",
            message: "请输入回访内容",
            type: "error"
          });
          return 
        }
        if (valid) {
          this.axios
            .post(
              "/student/follow",
              `class=${cs}&name=${name}&visitor=${visitor}&content=${desc}&position=${localStorage.position}`
            )
            .then(res => {
              if (res.data.ok == 1) {
                this.$notify({
                  title: "添加成功",
                  message: `${name} 添加回访成功`,
                  type: "success"
                });
                this.closeDialog();
                this.dialogFormVisible = false;
              } else {
                this.$notify({
                  title: "添加失败",
                  message: res.data.msg,
                  type: "error"
                });
                this.form.desc = "";
              }
            });
        } else {
          this.$notify({
            title: "添加失败",
            message: res.data.msg,
            type: "error"
          });
          this.form.desc = "";
        }
      });
    },
    // 打开学员更多信息
    handleMessage(item) {
      this.messageBox = true;
      this.getFollow(item);
      this.form.name = item.name;
      this.form.teacher = item.teacher;
      this.form.manager = item.manager;
      this.clearFormdata();
      this.axios
        .get("/student/getTall", { params: { name: item.name } })
        .then(res => {
          if (res.data.data.length > 0) {
            this.tallForm.education = res.data.data[0].education;
            this.tallForm.objective = res.data.data[0].objective;
            this.tallForm.specialty = res.data.data[0].specialty;
            this.tallForm.JobNature = res.data.data[0].JobNature;
            this.tallForm.other = res.data.data[0].other;
            if (res.data.data[0].outProduction) {
              this.fromdata.outProduction = Boolean(
                JSON.parse(res.data.data[0].outProduction)
              );
            }
            if (res.data.data[0].publicPraise) {
              this.fromdata.publicPraise = Boolean(
                JSON.parse(res.data.data[0].publicPraise)
              );
            }
            if (res.data.data[0].certificate) {
              this.fromdata.certificate = Boolean(
                JSON.parse(res.data.data[0].certificate)
              );
            }
            if (res.data.data[0].intEducation) {
              this.fromdata.intEducation = Boolean(
                JSON.parse(res.data.data[0].intEducation)
              );
            }
            if (res.data.data[0].repPurchase) {
              this.fromdata.repPurchase = Boolean(
                JSON.parse(res.data.data[0].repPurchase)
              );
            }
            this.textarea = res.data.data[0].remark;
          } else {
            this.clearTall();
          }
        });
    },
    // 获取学员回访信息
    getFollow(item) {
      this.messageBoxData = [];
      this.axios
        .get("/student/getFollow", {
          params: { visitor: localStorage.username }
        })
        .then(res => {
          for (var i = 0; i < res.data.data.length; i++) {
            if (res.data.data[i].name === item.name) {
              this.messageBoxData.push(res.data.data[i]);
            }
          }
        });
    },
    // 删除学员回访信息
    deleteFollow(item) {
      this.$confirm(`是否删除此条学员回访记录`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.axios
            .post(
              "/student/deleteFollow",
              `id=${item.id}&name=${item.name}&visitor=${localStorage.username}&position=${localStorage.position}`
            )
            .then(res => {
              if (res.data.ok == 1) {
                this.$message({
                  type: "success",
                  message: res.data.msg
                });
                this.getFollow(item);
              } else {
                this.$message.error(res.data.msg);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 打开修改学员弹框
    handleEdit(item) {
      this.dialogType = "edit";
      this.dialogFormVisible = true;

      this.form.id = item.id;
      this.form.time = item.time;
      this.form.name = item.name;
      this.form.class = item.class;
      this.form.phone = item.phone;
      this.form.product = item.product;
      this.form.teacher = item.teacher;
      this.form.manager = item.manager;
      this.form.admission = item.admission;
      this.form.address = item.address;

      if (item.status === 0) {
        return (this.form.status = "正式");
      } else if (item.status === 1) {
        return (this.form.status = "转中心");
      } else if (item.status === 2) {
        return (this.form.status = "休学");
      } else if (item.status === 3) {
        return (this.form.status = "脱产");
      } else if (item.status === 4) {
        return (this.form.status = "结课");
      } else {
        return (this.form.status = "退费");
      }
    },
    // 修改学员
    editStudent(formName) {
      var id = this.form.id;
      var time = this.form.time;
      var name = this.form.name;
      var cs = this.form.class;
      cs = cs.toUpperCase();
      var phone = this.form.phone;
      var product = this.form.product;
      product = product.toUpperCase();
      var teacher = this.form.teacher;
      var manager = this.form.manager;
      var admission = this.form.admission;
      var status = this.form.status;
      var address = this.form.address;
      this.axios
        .post(
          "/student/update",
          `time=${time}&name=${name}&class=${cs}&phone=${phone}&product=${product}&teacher=${teacher}&manager=${manager}&admission=${admission}&status=${status}&address=${address}&id=${id}`
        )
        .then(res => {
          if (res.data.ok == 1) {
            this.$notify({
              title: "修改成功",
              message: `${name} 修改成功`,
              type: "success"
            });
            this.closeDialog();
            this.load();
          } else {
            this.$notify({
              title: "修改失败",
              message: res.data.msg,
              type: "error"
            });
            this.form.name = "";
          }
        });
    },
    // 关闭清空form数据
    closeDialog() {
      for (var item in this.form) {
        this.form[item] = "";
      }
      this.dialogFormVisible = false;
    },
    // 删除学员
    del(item) {
      this.$confirm(`是否删除名称为 "${item.name}" 学员?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.axios
            .post("/student/delete", `id=${item.id}&name=${item.name}`)
            .then(res => {
              if (res.data.ok == 1) {
                this.$message({
                  type: "success",
                  message: res.data.msg
                });
                this.load();
              } else {
                this.$message.error(res.data.msg);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 首访表 立即创建
    onSubmit() {
      var _this = this;
      var name = _this.form.name;
      var education = _this.tallForm.education;
      var objective = _this.tallForm.objective;
      var specialty = _this.tallForm.specialty;
      var JobNature = _this.tallForm.JobNature;
      var other = _this.tallForm.other;
      var teacher = _this.form.teacher;
      var manager = _this.form.manager;

      _this.axios
        .post(
          "/student/insertTall",
          `name=${name}&education=${education}&objective=${objective}&specialty=${specialty}&JobNature=${JobNature}&other=${other}&teacher=${teacher}&manager=${manager}`
        )
        .then(res => {
          if (res.data.ok == 1) {
            _this.$notify({
              title: "添加成功",
              message: `${name + res.data.msg}`,
              type: "success"
            });
            _this.clearTall();
            _this.messageBox = false;
          } else {
            _this.$notify({
              title: "添加失败",
              message: res.data.msg,
              type: "error"
            });
          }
        });
    },
    // 增值服务 立即保存
    submit() {
      var _this = this;
      var name = _this.form.name;
      var outProduction = this.fromdata.outProduction;
      var publicPraise = this.fromdata.publicPraise;
      var certificate = this.fromdata.certificate;
      var intEducation = this.fromdata.intEducation;
      var repPurchase = this.fromdata.repPurchase;
      var remark = _this.textarea;
      _this.axios
        .post(
          "/student/updateTall",
          `name=${name}&outProduction=${outProduction}&publicPraise=${publicPraise}&certificate=${certificate}&intEducation=${intEducation}&repPurchase=${repPurchase}&remark=${remark}`
        )
        .then(res => {
          if (res.data.ok == 1) {
            _this.$notify({
              title: "添加成功",
              message: `${name + res.data.msg}`,
              type: "success"
            });
            _this.clearFormdata();
            _this.messageBox = false;
            _this.load();
          } else {
            _this.$notify({
              title: "添加失败",
              message: res.data.msg,
              type: "error"
            });
          }
        });
    },
    // 取消清空首访数据
    clearTall() {
      for (var item in this.tallForm) {
        this.tallForm[item] = "";
      }
    },
    // 清空增值服务数据
    clearFormdata() {
      for (var item in this.fromdata) {
        this.fromdata[item] = false;
      }
      this.textarea = "";
    },
    // 分页
    handleSizeChange(val) {
      this.pageSize = val;
    },
    handleCurrentChange(val) {
      this.currentPage = val;
    }
  }
};
</script>

<style>
.app-container {
  padding: 0;
}
.sortable-ghost {
  opacity: 0.8;
  color: #fff !important;
  background: #42b983 !important;
}
.radio-label {
  font-size: 14px;
  color: #606266;
  line-height: 40px;
  padding: 0 12px 0 30px;
}
</style>

<style scoped>
.icon-star {
  margin-right: 2px;
}
.drag-handler {
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.show-d {
  margin-top: 15px;
}
</style>
